<template>
	<view>
		<form @submit="handleSubmit">
			<map class="map" :latitude="latitude" :longitude="longitude" ></map>
			<view class="cu-form-group margin-top">
				<view class="title">
					<text class="cuIcon-friendfill"></text>
				</view>
				<input name='username' placeholder="请输入姓名" value=""></input>
			</view>
			<view class="cu-form-group">
				<view class="title">
					<text class="cuIcon-mobilefill"></text>
				</view>
				<input  name='phone' placeholder="请输入号码" value=""></input>
			</view>
			<view class="cu-form-group">
				<view class="title">
					<text class="cuIcon-locationfill"></text>
				</view>
				<view class="title">{{index ==-1?'区域':array[index]}}</view>
				<picker :range="array" :value='index'  @change="bindPickerChange">
					<view class="picker" >
						请选择区域
					</view>
				</picker>
			</view>
			<view class="cu-form-group">
				<view class="title">
					<text class="cuIcon-locationfill"></text>
				</view>
				<input name='detail' placeholder="输入详细地址" value="" ></input>

			</view>
			<view class="padding">
				<button class="cu-btn block bg-brown" form-type="submit">
					确定
				</button>
			</view>
		</form>
	</view>
</template>

<script>
	import {mapState} from 'vuex'
	export default {
		data() {
			return {
				id:0,
				latitude: 116.4, //纬度
				longitude: 39.9, //经度
				index:-1,
				array:[
					'仓山区','鼓楼区','不知道啥区','这部分还没做完(此项先别选)'
				]
			}
		},
		computed:{
			...mapState({
				// userinfo:state=>state.user.userinfo
			})
		},
		methods: {
			bindPickerChange(event){
				console.log(event.detail.value);
				this.index = event.detail.value
			},
			handleSubmit(event){
				// console.log(event);
				let {value} = event.detail
				value.region =this.array[this.index]
				value.city ="福州"
				value.isdefault = Boolean(value.isdefault)
				// console.log(typeof(value.isdefault));
				
				this.userinfo =  uni.getStorageSync('username')
				console.log(this.userinfo);
				value.userid = this.userinfo.objectId
				console.log(value);
				this.$store.dispatch('address/Addressaddact',value)
			}
		},
		onLoad() {

			uni.getLocation({
				type: 'wgs84 ',
				success: (res) => {
					console.log('经度：' + res.longitude);
					console.log('纬度：' + res.latitude);

					this.longitude = res.longitude
					this.latitude = res.latitude

				},

			});
		}
	}
</script>

<style lang="scss">
	.map {
		height: 400upx;
		width: 100%;

	}
</style>
